<template>
  <div class="commission">
    <dt-search ref="search" :labelWidth="labelWidth" :xl="5" :xlBtn="4" @reset="resetFun" />
    <dt-grid ref="table" :columns="columns" page :onFetch="onFetch" />
    <process-modal ref="process" />
  </div>
</template>

<script>
  import columnOpt from './opt/column.js'
  import searchOpt from './opt/search.js'
  import processModal from '@/components/biz/audit/process-modal.vue'
  import auditMgr from '@/biz/flowApproval/processAudit.js'
  import dt from '@dt/dt'

  export default {
    components: {
      processModal
    },
    data() {
      return {
        columns: [],
        status: '0',
        labelWidth: 100
      }
    },
    watch: {
      $route(to, from) {
        let retainParams = dt.memory.get('reportApprove')

        if (to.name == 'reportApprove') {
          this.$refs.search.init(this.$refs.table, searchOpt.options(this), {
            orgId: [],
            state: retainParams?.state,
            housesId: retainParams?.housesId,
            companyId: retainParams?.companyId,
            housesName: retainParams?.housesName
          })
          this.$refs.table.fetch()
        }
      }
    },
    mounted() {
      let retainParams = dt.memory.get('reportApprove')

      this.columns = columnOpt.options()
      this.$refs.table.init(this)
      this.$refs.search.init(this.$refs.table, searchOpt.options(this), {
        orgId: [],
        state: retainParams?.state,
        housesId: retainParams?.housesId,
        companyId: retainParams?.companyId,
        housesName: retainParams?.housesName
      })
      this.$refs.table.fetch()
    },
    methods: {
      onDetail(item) {
        this.$router.push({
          path: 'reportApprove/ArticleReviewDetail',
          query: { articleId: item.businessId, auditId: item.auditId, type: 'View' }
        })
      },
      resetFun() {
        dt.memory.remove('reportApprove')
        this.$refs.search.init(this.$refs.table, searchOpt.options(this), {
          orgId: [],
          housesId: '',
          state: ''
        })
      },
      onFetch(data) {
        dt.memory.get('reportApprove')?.UContainSelf !== undefined &&
          (data.containSelf = !dt.memory.get('reportApprove'))

        return auditMgr
          .list({
            ...data,
            auditType: 13,
            buttonType: -1
          })
          .then((res) => {
            res &&
              res.list.forEach((item) => {
                item = Object.assign(item, item.auditData)
              })
            return res
          })
      },
      onFlow(data) {
        this.$refs.process.show({
          ...data,
          auditType: 13
        })
      }
    }
  }
</script>

<style lang="scss" scoped>
  .commission {
    padding: 20px;
  }
</style>
